
<template>
	<view class="page">
		<view class="order" v-for="(item,index) in dataList" :key='index'>
		    <view class="id">
		        <text>订单编号 : {{item.orderId}}</text>
		    </view>
            
            <view class="flexRowC" v-for="(itemIn,indx) in item.list" style="margin-bottom: 20rpx;">
                <image style="width: 200rpx; height: 200rpx; margin-right: 20rpx;" :src="itemIn.picPosition[0]" mode=""></image>
                <view class="" style="width: 500rpx;">
                    <view class=" flexRowC" style="justify-content: space-between; font-size: 36rpx; margin-bottom: 60rpx;">
                        <view class="ovel" >
                            <text>{{itemIn.goodsContent}}</text>
                        </view>
                        <text> ￥{{itemIn.goodsPrice}}</text>
                    </view>
                    
                    <view class="flexRowC" style="justify-content: space-between; color: #999;">
                        <text>{{itemIn.goodsName}}</text>
                        <text> X {{itemIn.num}}</text>
                    </view>
                    
                </view>
            </view>
            <view class="flexRowC" style="border-top: 1rpx solid #ccc; width: 100%; height: 100rpx; justify-content: space-around;">
                <text style="color: #999;">{{item.createTime}}</text>
                <view class="">
                    <text style="color: #999; margin-right: 20rpx;">总价￥{{item.orderAllPrice}}</text> 实付款￥{{item.orderEndPrice}}
                </view>
            </view>
		</view>
	</view>
</template>

<script>
	
	export default {
		components:{
			
		},
		data() {
			return {
				
				dataList:[],
				
			}
			
		},
		computed: {
			
			
		},
		onShow() {
			
		},
		onLoad() {
			this.getData()
		},
		methods: {
			getData(){
				this.$http.get('goods_order/getOrder').then(res=>{
					this.dataList=res.list
				})
			}
		}
	}
</script>



<style lang="scss" scoped>
	.page {
		width: 100%;
		height: 100%;
		background-color: #f4f5f6;
        padding: 20rpx;
		.order{
            width: 100%;
            min-height: 200rpx;
            height: auto;
            background-color: #fff;
            margin-bottom: 10rpx;
            border-radius: 10rpx;
            padding: 20rpx;
        }
        .ovel{
            
            width: 340rpx;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }
	}
</style>
